<template>
  <a-modal
    title="修改"
    :maskClosable="false"
    :width="1050"
    placement="right"
    :closable="true"
    @cancel="onClose"
    :visible="pBankSupportCfgEditVisiable"
  >
    <a-form :form="form">
      <a-row>
        <a-col :md="12" :sm="24">
          <a-form-item label="通道标识" v-bind="formItemLayout">
            <a-input :disabled="true" v-decorator="['dstChannelName']" />
            <a-input
              hidden="true"
              v-decorator="['dstChannelId']"
            /> </a-form-item
        ></a-col>
        <a-col :md="12" :sm="24">
          <a-form-item label="支持业务类别" v-bind="formItemLayout">
            <a-select v-decorator="['supportBizType']" @change="handleChange">
              <a-select-option value="00"> 智能路由 </a-select-option>
              <a-select-option value="11"> 企业网银业务 </a-select-option>
              <a-select-option value="20"> 快捷支付业务 </a-select-option>
              <a-select-option value="10"> 人个网银业务 </a-select-option>
            </a-select>
          </a-form-item></a-col
        >
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24">
          <a-form-item label="联行行号" v-bind="formItemLayout">
            <a-select v-decorator="['bankNo']" @change="handleChange">
              <a-select-option value="00"> </a-select-option>
            </a-select> </a-form-item
        ></a-col>
        <a-col :md="12" :sm="24">
          <a-form-item label="银行简码" v-bind="formItemLayout">
            <a-input
              v-decorator="[
                'bankSimpleCode',
                {
                  rules: [
                    { required: true, message: '不能为空' },
                    { max: 14, message: '不能超过14位字符' },
                  ],
                },
              ]"
            /> </a-form-item
        ></a-col>
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24"
          ><a-form-item label="借记账户支持标识" v-bind="formItemLayout">
            <a-select v-decorator="['debitSupportFlag']" @change="handleChange">
              <a-select-option value="Y"> 支持 </a-select-option>
              <a-select-option value="N"> 不支持 </a-select-option>
            </a-select>
          </a-form-item></a-col
        >
        <a-col :md="12" :sm="24"
          ><a-form-item label="贷记账户支持标志" v-bind="formItemLayout">
            <a-select
              v-decorator="['creditSupportFlag']"
              @change="handleChange"
            >
              <a-select-option value="Y"> 支持 </a-select-option>
              <a-select-option value="N"> 不支持 </a-select-option>
            </a-select>
          </a-form-item></a-col
        >
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24">
          <a-form-item label="参与营销活动标志" v-bind="formItemLayout">
            <a-select v-decorator="['mcFlag']" @change="handleChange">
              <a-select-option value="Y"> 参与 </a-select-option>
              <a-select-option value="N"> 不参与 </a-select-option>
            </a-select>
          </a-form-item></a-col
        >
        <a-col :md="12" :sm="24"
          ><a-form-item label="营销活动编号" v-bind="formItemLayout">
            <a-input v-decorator="['mcNo']" /> </a-form-item
        ></a-col>
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24">
          <a-form-item label="营销活动名称" v-bind="formItemLayout">
            <a-input v-decorator="['mcName']" /> </a-form-item
        ></a-col>
        <a-col :md="12" :sm="24">
          <a-form-item label="单笔交易限额(元)" v-bind="formItemLayout">
            <a-input
              v-decorator="[
                'singleLimitAmt',
                {
                  relus: [
                    {
                      max: 15,
                      message: '不能超过15位字符',
                    },
                    {
                      reg: '^[0-9]+(.[0-9]{1,2})?$',
                      message: '数据校验未通过',
                    },
                  ],
                },
              ]"
            /> </a-form-item
        ></a-col>
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24">
          <a-form-item label="日累计交易限额(元)" v-bind="formItemLayout">
            <a-input
              v-decorator="[
                'dayLimitAmt',
                {
                  relus: [
                    {
                      max: 15,
                      message: '不能超过15位字符',
                    },
                    {
                      reg: '^[0-9]+(.[0-9]{1,2})?$',
                      message: '数据校验未通过',
                    },
                  ],
                },
              ]"
            /> </a-form-item
        ></a-col>
        <a-col :md="12" :sm="24">
          <a-form-item label="银行logo" v-bind="formItemLayout">
            <a-input
              v-decorator="[
                'dayLimitAmt',
                {
                  relus: [
                    {
                      require: true,
                      message: '必填',
                    },
                  ],
                },
              ]"
            /> </a-form-item
        ></a-col>
      </a-row>
      <a-row>
        <a-col :md="12" :sm="24"
          ><a-form-item label="其他信息" v-bind="formItemLayout">
            <a-input v-decorator="['otherData']" row="3" /> </a-form-item
        ></a-col>
      </a-row>
    </a-form>
    <div class="drawer-bootom-button">
      <a-popconfirm
        title="确定放弃编辑？"
        @confirm="onClose"
        okText="确定"
        cancelText="取消"
      >
        <a-button style="margin-right: 0.8rem">取消</a-button>
      </a-popconfirm>
      <a-button @click="handleSubmit" type="primary" :loading="loading"
        >保存</a-button
      >
    </div>
  </a-modal>
</template>
<script>
import { mapState, mapMutations } from "vuex";

const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 8 },
};
const supportAcctTypeList = [];
export default {
  name: "PBankSupportCfgEdit",
  props: {
    pBankSupportCfgEditVisiable: {
      default: false,
    },
  },
  data() {
    return {
      formItemLayout,
      form: this.$form.createForm(this),
      roleData: [],
      userId: "",
      loading: false,
      supportAcctTypeList,
    };
  },
  computed: {
    ...mapState({
      currentUser: (state) => state.account.user,
    }),
  },
  methods: {
    ...mapMutations({
      setUser: "account/setUser",
    }),
    onClose() {
      this.loading = false;
      this.form.resetFields();
      this.$emit("close");
    },
    setFormValues({ ...list }) {
      let fields = [
        "dstChannelId",
        "dstChannelName",
        "supportBizType",
        "bankNo",
        "bankName",
        "bankSimpleCode",
        "debitSupportFlag",
        "creditSupportFlag",
        "mcFlag",
        "mcNo",
        "mcName",
        "singleLimitAmt",
        "dayLimitAmt",
        "bankLogoUrl",
        "otherData",
      ];
      Object.keys(list).forEach((key) => {
        if (fields.indexOf(key) !== -1) {
          this.form.getFieldDecorator(key);
          let obj = {};
          obj[key] = list[key];
          this.form.setFieldsValue(obj);
        }
      });
    },

    handleSubmit() {
      this.form.validateFields((err, values) => {
        if (!err) {
          this.loading = true;
          let user = this.form.getFieldsValue();
          user.roleId = user.roleId.join(",");
          user.userId = this.userId;
          user.deptId = this.userDept;
          this.$put("user", {
            ...user,
          })
            .then((r) => {
              this.loading = false;
              this.$emit("success");
              // 如果修改用户就是当前登录用户的话，更新其state
              if (user.username === this.currentUser.username) {
                this.$get(`user/${user.username}`).then((r) => {
                  this.setUser(r.data);
                });
              }
            })
            .catch(() => {
              this.loading = false;
            });
        }
      });
    },
  },
  watch: {},
};
</script>
